import React, { Component } from 'react'
import { createPortal } from 'react-dom'

class Dialog extends Component {
  render() {
    return createPortal(
      <div>
        <h3>弹出层</h3>
      </div>,
      document.body
    )
  }
}

class App extends Component {
  state = {
    show: true
  }
  render() {
    return (
      <div>
        <h1>我是App组件</h1>
        <button
          onClick={() => {
            this.setState((state) => ({
              show: !state.show
            }))
          }}
        >
          显示 / 隐藏
        </button>
        <hr />
        {this.state.show ? <Dialog /> : null}
      </div>
    )
  }
}

export default App
